<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="CommonUtil/CommonUtil.js"></script>
    <script type="text/javascript" charset="utf-8">
        var CalendarInterface = new BH.Interface('CalendarInterface',['display']);
        var CalendarYear = function (year,parent) {
            this.year = year;
            this.element = document.createElement('div');
            this.element.style = 'none';
            parent.append(this.element);
            //判断是否是闰年
            var isLeapYear = function (y) {
                return (y>0) && !(y%4) && ((y/100) || !(y%400));
            };
            this.months = [];
            //承装当前年各个月的天数
            this.numDays =[31,isLeapYear(this.year)?29:28,31,30,31,30,31,31,30,31,30,31];
            for(var i = 0;i<12;i++){
                this.months[i] = new CalendarMonth(i,this.numDays[i],this.element);
            }
        };
        CalendarYear.prototype = {
            constructor:CalendarYear,
            display:function () {
                for(var i = 0;i<this.months.length;i++){
                    this.months[i].display();
                }
                //显示出来月份
                this.element.style.display = 'block';
            }
        }
        var CalendarMonth = function (monthNum,numDays,parent) {
            this.monthNum = monthNum;
            this.element = document.createElement('div');
            this.element.style = 'none';
            parent.appendChild(this.element);
            //月份应该包含一个天数的数组
            this.days = [];
            for(var i = 0;i<numDays;i++){
                this.days[i] = new CalendarDay(i+1,this.element);
            }
        };
        CalendarMonth.prototype = {
            constructor:CalendarMonth,
            display:function () {
                for(var i = 0;i<this.days.length;i++){
                    this.days[i].display();
                }
                //显示出天
                this.element.style.display = 'block';
            }

        }
        var CalendarDay = function (date,parent) {
            this.date = date;
            this.element = document.createElement('div');
            this.element.style = 'none';
            parent.appendChild(this.element);
        };
        CalendarDay.prototype = {
            constructor:CalendarDay,
            display:function () {
               this.element.style.display = 'inline-block';
               this.element.innerHTML= this.date;
            }
        };
        window.onload = function () {
            var myDiv = document.getElementById('myDiv');
            var myYear = new CalendarYear('2013',myDiv);
            myYear.display();
        }
    </script>
</head>
<body>
<div id ="myDiv"></div>
</body>
</html>